<template>
	<view class="content">
		<!-- 告警 -->
		<view class="warns" v-if="warnTable.length>0">
			<view class="warn">
				告警
			</view>
			<view class="table">
				<view class="tr">
					<view class="th addr-text">地址Id</view>
					<view class="th time-text">内容</view>
					<view class="th width-text">时间</view>
				</view>
				<view class="tr warn-tr" v-for="(item,index) in warnTable" :key="index">
					<view class="td addr-text">
						{{ item.addrId || ""}}
					</view>
					<view class="td time-text">
						{{ item.semaphoreName || ''}}
					</view>
					<view class="td width-text">{{ item.occurrenceTime || ""}}</view>
				</view>
			</view>
			<uni-pagination @change="changePage()" :pageSize="warnSize" :current="warnPage" :total="warnTotal"
				:show-icon="true" prev-text="前一页" next-text="后一页" />
		</view>
		<!--换电柜 仓状态 -->
		<uni-card v-if="binForm.entitys.length>0 && equipTypeCode == 'EC'">
			<view class="bin-card">
				<view class="bin-one" v-for="(one,index) in binForm.entitys" :key="index" :is-shadow="false">
					<view
						:class="['bin-border',{ 'wareHouse1' : one['06010039'] == 0, 'wareHouse2' : one['06010039'] == 1, 'wareHouse3' : one['06010039'] == 2, 'wareHouse4' : one['06010039'] == 3 }]"
						@click="binPopup(index)">{{BIN_STATUS[one['06010039']]}}</view>
					<text v-if="one.addrId">{{one.addrId || ""}}号仓</text>
				</view>
			</view>
		</uni-card>
		<!-- 换电柜 -->
		<uni-card v-if="equipTypeCode == 'EC'">
			<view>
				系统温度：<span class="parval">{{ cardForm["06010042"] }}</span>
			</view>
			<view>
				物联网卡号：<span class="parval">{{ cardForm["06010040"] }}</span>
			</view>
			<view>系统配置：<span class="parval">{{ cardForm["06010041"] }}</span></view>
		</uni-card>

		<!-- 充电堆 -->
		<view v-else-if="equipTypeCode == 'CS'">
			<uni-card title="模块信息" class="modules" v-if="binForm2.entitys.length>0">
				<view class="bin-card">
					<view class="bin-one" v-for="(one,index) in binForm2.entitys" :key="index" :is-shadow="false"
						@click="modulePopup(index)">
						<view class="bin-border"
							:style="[{borderColor:one['07010032']&&one['07010032']!='0' ?colorArray[one['07010032']]:'',color:one['07010032']&&one['07010032']!='0'?colorArray[one['07010032']]:'',fontSize:'32rpx'}]">
							{{one['07010032']=='0'?'未分配':(one['07010032'] || '')}}
						</view>
						<text>{{index+1}}号</text>
					</view>
				</view>
			</uni-card>

			<uni-card title="端口信息" class="modules" v-if="binNum2>0">
				<view class="bin-card">
					<view class="bin-one" v-for="(one,index) in Number(binNum2)" :key="index" :is-shadow="false"
						@click="portPopup(index)">
						<view class="bin-border" :style="{fontSize:'42rpx'}">{{index+1}}</view>
					</view>
				</view>
			</uni-card>

			<uni-card>
				<view>4G信号CSQ：<span class="parval">{{ cardForm2["07010041"] }}</span></view>
				<view>物联网卡号：<span class="parval">{{ cardForm2["07010040"] }}</span></view>
				<view>电表输入总电量：<span class="parval">{{ cardForm2["07010064"] }}</span> kW·h</view>
				<view>电表输入电压：<span class="parval">{{ cardForm2["07010065"] }}</span> V</view>
			</uni-card>
			<uni-card title="散热系统">
				<view>风扇组1状态：<span class="parval">{{ cardForm2["07010045"] }}</span></view>
				<view>风扇组2状态：<span class="parval">{{ cardForm2["07010046"] }}</span></view>
				<view>水箱进水1温度：<span class="parval">{{ cardForm2["07010049"] }}</span> ℃</view>
				<view>水箱进水2温度：<span class="parval">{{ cardForm2["07010050"] }}</span> ℃</view>
				<view>水泵组1状态：<span class="parval">{{ cardForm2["07010047"] }}</span></view>
				<view>水泵组2状态：<span class="parval">{{ cardForm2["07010048"] }}</span></view>
				<view>水箱出水1温度：<span class="parval">{{ cardForm2["07010051"] }}</span> ℃</view>
				<view>水箱出水2温度：<span class="parval">{{ cardForm2["07010052"] }}</span> ℃</view>
				<view>液体流速：<span class="parval">{{ cardForm2["07010053"] }}</span> L/min</view>
				<view>环境温度：<span class="parval">{{ cardForm2["07010054"] }}</span> ℃</view>
				<view>环境湿度：<span class="parval">{{ cardForm2["07010055"] }}</span> %</view>
			</uni-card>
		</view>

		<Params :equipId="id" :equipCode="code" :paramCode="paramCode"></Params>

		
		<!-- @touchmove.stop.prevent="moveHandle" @catchtouchmove="moveHandle" -->
		<uni-popup ref="binpopup" type="center" class="bin_popup" :animation="false" :is-mask-click="false">
			<view class="alertbox binpopbox">
				<uni-icons class="closeempty" type="closeempty" size="30" color="#999"
					@click="closeBinpopup('binpopup')"></uni-icons>
				<view class="binparam">
					<view class="bin_index_left">
						{{currentIndex}}
					</view>
					<view class="bin_right">
						<view class="binone">
							<text class="labels">输入电压：</text>
							<text>{{binDetail["06010035"] || ''}} V</text>
						</view>
						<view class="binone">
							<text class="labels">输出电压：</text>
							<text>{{binDetail["06010033"] || ''}} V</text>
						</view>
						<view class="binone">
							<text class="labels">输出电流：</text>
							<text>{{binDetail["06010034"] || ''}} A</text>
						</view>
						<view class="binone">
							<text class="labels">仓温度：</text>
							<text>{{binDetail["06010038"] || ''}} ℃</text>
						</view>
						<view class="binone">
							<text class="labels">门轴状态：</text>
							<text v-if="binDetail['06010043'] === '0'">打开</text>
							<text v-else-if="binDetail['06010043'] === '1'">关闭</text>
						</view>
						<view class="binone">
							<text class="labels">仓锁状态：</text>
							<text v-if="binDetail['06010036'] === '0'">打开</text>
							<text v-else-if="binDetail['06010036'] === '1'">关闭</text>
						</view>
						<view class="binone">
							<text class="labels">电池在位状态：</text>
							<text v-if="binDetail['06010037'] === '0'">不在位</text>
							<text v-if="binDetail['06010037'] === '1'">在位</text>
						</view>
						<view class="binone">
							<text class="labels">仓状态：</text>
							<text class="bin-status" :style="{border:(binDetail['06010039']==0 ?'2rpx solid #67c23a':'2rpx solid #f56c6c'),color:(binDetail['06010039']==0?'#67c23a':'#f56c6c')}">{{BIN_STATUS[binDetail['06010039']]}}</text>
						</view>

						<view class="binone">
							<text class="labels">禁仓原因：</text>
							<text v-if="binDetail['06010039'] == '3'">{{binDetail['binForbidReason']}}</text>
						</view>
						<view class="binone">
							<text class="labels">温度采样：</text>
							<text>{{binDetail['06010066']}}</text>
						</view>
						<view class="binone">
							<text class="labels">行程开关在位状态：</text>
							<text>{{binDetail['06010067']}}</text>
						</view>
						<view class="binone">
							<text class="labels">电池编码：</text>
							<text>{{binDetail['06010082']}}</text>
						</view>
						<view class="binone">
							<text class="labels">在位电压：</text>
							<text>{{binDetail['06010083']}}</text>
						</view>
						<view class="binone">
							<text class="labels">电池SOC：</text>
							<text>{{binDetail['06010068']}}</text>
						</view>
						<view class="binone">
							<text class="labels">电池充电电压：</text>
							<text>{{binDetail['06010069']}}</text>
						</view>
						<view class="binone">
							<text class="labels">电池充电电流：</text>
							<text>{{binDetail['06010070']}}</text>
						</view>
						<view class="binone">
							<text class="labels">输出连接器阻抗：</text>
							<text>{{binDetail['06010071']}}</text>
						</view>
						<view class="binone">
							<text class="labels">输入连接器阻抗：</text>
							<text>{{binDetail['06010072']}}</text>
						</view>
					</view>
				</view>
				<view class="bin_btns">
					<button type="default" hover-class="none" size="mini" v-if="permission('applet:equip:binabled')"
						@click="isForbidden(1)">禁用</button>
					<button type="default" hover-class="none" size="mini" v-if="permission('applet:equip:binabled')"
						@click="isForbidden(2)">解禁</button>
					<button type="primary" size="mini" v-if="permission('applet:equip:binparam')"
						@click="isSetting">参数设置</button>
				</view>
				<view class="param-content">
					<view class="param-one">
						<checkbox-group @change="checkboxChange($event,'check1')">
							<checkbox :checked="checkList.check1" color="#51b7b9" style="transform:scale(0.75)" />
						</checkbox-group>
						<text>运行模式</text>
						<uni-data-select class="sliders" placeholder="请选择运行模式" v-model="binDetail['06010044']"
							:localdata="runState"></uni-data-select>
					</view>
					<view class="param-one">
						<checkbox-group @change="checkboxChange($event,'check2')">
							<checkbox :checked="checkList.check2" color="#51b7b9" style="transform:scale(0.75)" />
						</checkbox-group>
						<text>充电电压</text>
						<input v-model="binDetail['06010046']" class="uni-input" type="digit"
						 placeholder="请输入充电电压" />
					</view>
					<view class="param-one">
						<checkbox-group @change="checkboxChange($event,'check3')">
							<checkbox :checked="checkList.check3" color="#51b7b9" style="transform:scale(0.75)" />
						</checkbox-group>
						<text>充电电流</text>
						<uni-data-select class="sliders" placeholder="请选择充电电流" v-model="binDetail['06010047']"
							:localdata="electricJuice"></uni-data-select>
					</view>
					<view class="param-one">
						<checkbox-group @change="checkboxChange($event,'check4')">
							<checkbox :checked="checkList.check4" color="#51b7b9" style="transform:scale(0.75)" />
						</checkbox-group>
						<text>电池类型</text>
						<uni-data-select class="sliders" placeholder="请选择电池类型" v-model="binDetail['06010048']"
							:localdata="batteryType"></uni-data-select>
					</view>
					<view class="param-one">
						<checkbox-group @change="checkboxChange($event,'check5')">
							<checkbox :checked="checkList.check5" color="#51b7b9" style="transform:scale(0.75)" />
						</checkbox-group>
						<text>备电模式</text>
						<uni-data-select class="sliders" placeholder="请选择备电模式" v-model="binDetail['06010045']"
							:localdata="electricMode"></uni-data-select>
					</view>
					<view class="param-one">
						<checkbox-group @change="checkboxChange($event,'check6')">
							<checkbox :checked="checkList.check6" color="#51b7b9" style="transform:scale(0.75)" />
						</checkbox-group>
						<text>气溶胶</text>
						<uni-data-select class="sliders" placeholder="请选择气溶胶" v-model="binDetail['06010063']"
							:localdata="aerosol"></uni-data-select>
					</view>

					<view class="param-one">
						<checkbox-group @change="checkboxChange($event,'check7')">
							<checkbox :checked="checkList.check7" color="#51b7b9" style="transform:scale(0.75)" />
						</checkbox-group>
						<text>邮政密码</text>
						<input v-model="binDetail['06010029']" class="uni-input" @input="onPasswordInput('06010029')"
							placeholder="请输入邮政密码" />
					</view>
				</view>

			</view>
		</uni-popup>

		<!-- 模块信息弹框 -->
		<uni-popup ref="modulepopup" type="center" class="bin_popup" :animation="false" :is-mask-click="false"
			@touchmove.stop.prevent="moveHandle" @catchtouchmove="moveHandle">
			<view class="alertbox alertbox1 binpopbox">
				<uni-icons class="closeempty" type="closeempty" size="30" color="#999"
					@click="closeBinpopup('modulepopup')"></uni-icons>
				<view class="binparam">
					<view class="bin_left">
						{{currentIndex}}
					</view>
					<view class="bin_right">
						<view class="binone">
							<text class="labels">組号：</text>
							<text class="group-index"
								:style="[{borderColor:moduleDetail['07010032']&&moduleDetail['07010032']!='0' ?colorArray[moduleDetail['07010032']]:'',color:moduleDetail['07010032']&&moduleDetail['07010032']!='0'?colorArray[moduleDetail['07010032']]:'',fontSize:'32rpx'}]">{{moduleDetail["07010032"] || ''}}</text>
						</view>
						<view class="binone">
							<text class="labels">输出电压：</text>
							<text>{{moduleDetail["07010033"] || ''}} V</text>
						</view>
						<view class="binone">
							<text class="labels">输出电流：</text>
							<text>{{moduleDetail["07010034"] || ''}} A</text>
						</view>
						<view class="binone">
							<text class="labels">输入电压：</text>
							<text>{{moduleDetail["07010035"] || ''}} V</text>
						</view>
						<view class="binone">
							<text class="labels">输入电流：</text>
							<text>{{moduleDetail["07010036"] || ''}} A</text>
						</view>
						<view class="binone">
							<text class="labels">温度：</text>
							<text>{{moduleDetail["07010037"] || ''}} ℃</text>
						</view>
					</view>
				</view>
			</view>
		</uni-popup>

		<!-- 端口详情弹框 -->
		<uni-popup ref="portpopup" type="center" class="bin_popup" :animation="false" :is-mask-click="false"
			@touchmove.stop.prevent="moveHandle" @catchtouchmove="moveHandle">
			<view class="alertbox alertbox1 binpopbox">
				<uni-icons class="closeempty" type="closeempty" size="30" color="#999"
					@click="closeBinpopup('portpopup')"></uni-icons>
				<view class="binparam">
					<view class="bin_left">
						{{currentIndex}}
					</view>
					<view class="bin_right">
						<view class="binone">
							<text class="labels">需求电压：</text>
							<text>{{portDetail["07010060"] || ''}} V</text>
						</view>
						<view class="binone">
							<text class="labels">需求电流：</text>
							<text>{{portDetail["07010061"] || ''}} A</text>
						</view>
						<view class="binone">
							<text class="labels">总电压：</text>
							<text>{{portDetail["07010062"] || ''}} V</text>
						</view>
						<view class="binone">
							<text class="labels">总电流：</text>
							<text>{{portDetail["07010063"] || ''}} A</text>
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>
<script>
	import Params from './component/params.vue';
	import {
		warning,
		equipment
	} from "@/api/my.js";
	import {
		BIN_STATUS
	} from "@/common/config.js";
	import {
		runState,
		electricJuice,
		batteryType,
		electricMode,
		colorArray,
		aerosol,
		alarmSemaphoreCode,
	} from "@/common/config.js";
	import {
		permission
	} from "@/common/permission.js";
	import {
		mapState,
	} from 'vuex';
	export default {
		components: {
			Params
		},
		data() {
			return {
				runState: runState,
				electricJuice: electricJuice,
				batteryType: batteryType,
				electricMode: electricMode,
				colorArray: colorArray,
				aerosol: aerosol,

				code: "", //设备code
				id: "", //设备id
				warnPage: 1,
				warnSize: 5,
				warnTotal: 0,
				warnTable: [], //告警列表
				binNum: null, //格口数量
				binForm: {
					entitys: []
				},
				binForm2: {
					entitys: []
				},

				cardForm: {
					"06010042": "",
					"06010040": "",
					"06010041": "",
				},
				BIN_STATUS: BIN_STATUS, //仓状态
				paramCode: 500, //设备状态code
				// 仓详情
				binDetail: {
					"06010035": undefined,
					"06010033": undefined,
					"06010034": undefined,
					"06010038": undefined,
					"06010043": undefined,
					"06010036": undefined,
					"06010037": undefined,
					"06010039": undefined,

					"06010066": undefined,
					"06010067": undefined,
					"06010082": undefined,
					"06010083": undefined,
					"06010068": undefined,
					"06010069": undefined,
					"06010070": undefined,
					"06010071": undefined,
					"06010072": undefined,

					"06010044": undefined,
					"06010046": undefined,
					"06010047": undefined,
					"06010048": undefined,
					"06010045": undefined,
					"06010063": undefined,
					"06010029": undefined,
				},
				moduleDetail: {
					"07010032": undefined,
					"07010033": undefined,
					"07010034": undefined,
					"07010035": undefined,
					"07010036": undefined,
					"07010037": undefined,
				},
				portDetail: {
					"07010060": undefined,
					"07010061": undefined,
					"07010062": undefined,
					"07010063": undefined,
				},
				currentIndex: null, //当前仓号
				checkList: {
					check1: false,
					check2: false,
					check3: false,
					check4: false,
					check5: false,
					check6: false,
					check7: false,
				},
				checkedParam: {}, //选中的参数信息
				permission: permission,

				cardForm2: {
					"07010041": undefined,
					"07010040": undefined,
					"07010064": undefined,
					"07010065": undefined,
					"07010045": undefined,
					"07010047": undefined,
					"07010046": undefined,
					"07010048": undefined,
					"07010049": undefined,
					"07010051": undefined,
					"07010050": undefined,
					"07010052": undefined,
					"07010053": undefined,
					"07010054": undefined,
					"07010055": undefined,

					"07010031": undefined, //模块数量
					"07010059": undefined, //端口数量
				},
				binNum2: null, //端口数量

			}
		},
		computed: {
			...mapState(['equipTypeCode'])
		},

		onLoad(option) {
			this.code = decodeURIComponent(option.code);
			this.id = decodeURIComponent(option.id);
			// this.binNum = option.binCount ?? null;
			uni.setNavigationBarTitle({
				title: this.code || "参数详情"
			});

			this.warningList();
			if (this.equipTypeCode == 'EC') { //换电柜
				this.binNun();
			} else if (this.equipTypeCode == 'CS') { //充电堆
				this.doRead2(1);
			}
		},
		methods: {
			// 获取仓个数
			binNun() {
				equipment(`/operate/param/read/bincount/${this.id}`, 'post', {
					refresh: false
				}).then(res => {
					this.binNum = res.data;
					if (this.binNum) {
						this.detealBin();
					}
				});
			},
			detealBin() {
				for (let i = 0; i < this.binNum; i++) {
					let one = {
						"06010039": undefined,
					};
					this.binForm.entitys.push(one);
				}
				this.doRead();
			},
			// 读取参数
			doRead() {
				this.$Toast.loading('加载中~');
				let params = {
					entitys: [],
					equipId: this.id,
				};
				for (let i = 0; i < this.binNum; i++) {
					params.entitys.push({
						addrId: i + 1,
						id: "06010039"
					});
				}
				for (const key in this.cardForm) {
					params.entitys.push({
						id: key
					});
				}
				equipment("/operate/param/read", "post", params, 1)
					.then((res) => {
						uni.hideLoading();
						let datas = res.data;
						this.paramCode = res.code;
						datas.forEach((item) => {
							this.binForm.entitys.forEach((pp, index) => {
								for (const key in pp) {
									if (item.addrId == index + 1 && item.id == key) {
										pp[key] = item.value;
										if (item.addrId || item.addrId == 0) {
											pp['addrId'] = item.addrId;
										}
									}
								}
							});
							for (const key in this.cardForm) {
								if (key == item.id) {
									this.cardForm[key] = item.value;
								}
							}
						});
					})
					.catch((err) => {
						this.paramCode = err.code;
					});
			},
			warningList() {
				warning(`/existing/all/${this.id}?pageNum=${this.warnPage}&pageSize=${this.warnSize}`, 'post').then(
					res => {
						if (res.code == 200) {
							this.warnTable = res.data;
							this.warnTotal = +res.total;
						}
					});
			},
			// 分页
			changePage(e) {
				this.warnPage = e.current;
				this.warningList();
			},
			onPasswordInput(type){
				setTimeout(() => {
					this.binDetail[type] = this.binDetail[type].replace(/\s+/g, '');
					this.binDetail[type] = this.binDetail[type].replace(/[\u4E00-\u9FA5]/g,'')
				}, 10)
			},

			// 仓状态详情
			binPopup(index) {
				if (this.paramCode != 200) {
					this.$Toast.none('设备不可用！');
					return;
				}
				this.$refs.binpopup.open('center');
				this.checkedParam = {};
				for (const key in this.checkList) {
					this.$set(this.checkList, key, false)
				}

				for (const key in this.binDetail) {
					this.binDetail[key] = undefined;
				}

				this.currentIndex = index + 1;
				this.binRead(index);
			},
			// 模块信息详情
			modulePopup(index) {
				if (this.paramCode != 200) {
					this.$Toast.none('设备不可用！');
					return;
				}
				this.$refs.modulepopup.open('center');
				this.currentIndex = index + 1;
				this.moduleRead(index);
			},
			// 端口详情信息
			portPopup(index) {
				if (this.paramCode != 200) {
					this.$Toast.none('设备不可用！');
					return;
				}
				this.$refs.portpopup.open('center');
				this.currentIndex = index + 1;
				this.portRead(index);
			},
			closeBinpopup(popRef) {
				this.$refs[popRef].close();
			},

			binRead(index) {
				this.$Toast.loading('加载中~');
				let params = {
					entitys: [{
							addrId: index + 1,
							id: "06010035"
						},
						{
							addrId: index + 1,
							id: "06010033"
						},
						{
							addrId: index + 1,
							id: "06010034"
						},
						{
							addrId: index + 1,
							id: "06010038"
						},
						{
							addrId: index + 1,
							id: "06010043"
						},
						{
							addrId: index + 1,
							id: "06010036"
						},
						{
							addrId: index + 1,
							id: "06010037"
						},
						{
							addrId: index + 1,
							id: "06010039"
						},

						{
							addrId: index + 1,
							id: "06010066"
						},
						{
							addrId: index + 1,
							id: "06010067"
						},
						{
							addrId: index + 1,
							id: "06010082"
						},
						{
							addrId: index + 1,
							id: "06010083"
						},
						{
							addrId: index + 1,
							id: "06010068"
						},
						{
							addrId: index + 1,
							id: "06010069"
						},
						{
							addrId: index + 1,
							id: "06010070"
						},
						{
							addrId: index + 1,
							id: "06010071"
						},
						{
							addrId: index + 1,
							id: "06010072"
						},

						{
							addrId: index + 1,
							id: "06010044"
						},
						{
							addrId: index + 1,
							id: "06010046"
						},
						{
							addrId: index + 1,
							id: "06010047"
						},
						{
							addrId: index + 1,
							id: "06010048"
						},
						{
							addrId: index + 1,
							id: "06010045"
						},
						{
							addrId: index + 1,
							id: "06010063"
						},

						{
							addrId: index + 1,
							id: "06010029"
						},
					],
					equipId: this.id,
				};
				equipment("/operate/param/read", "post", params, 1)
					.then((res) => {
						let datas = res.data;
						datas.forEach((item) => {
							for (const key in this.binDetail) {
								if (item.addrId == this.currentIndex && item.id == key) {
									this.binDetail[key] = item.value;
								}
							}
						});
						
						if(res.code ==200){
							this.doBinReason();
						}
					})
					.finally(() => {
						uni.hideLoading();
					});
			},
			// 读取禁仓原因
			doBinReason() {
				warning(
					`/existing/${this.id}/${alarmSemaphoreCode}`,
					"post"
				).then((res) => {
					let datas = res.data;

					datas.forEach((item) => {
						for (const key in this.binDetail) {
							if (item.addrId == this.currentIndex) {
								this.binDetail['binForbidReason'] = item.value;
							}
						}
					});
					this.$forceUpdate();
				});
			},
			// 模块信息详情
			moduleRead(index) {
				this.$Toast.loading('加载中~');
				let params = {
					entitys: [{
							addrId: index + 1,
							id: "07010032"
						},
						{
							addrId: index + 1,
							id: "07010033"
						},
						{
							addrId: index + 1,
							id: "07010034"
						},
						{
							addrId: index + 1,
							id: "07010035"
						},
						{
							addrId: index + 1,
							id: "07010036"
						},
						{
							addrId: index + 1,
							id: "07010037"
						}
					],
					equipId: this.id,
				};
				equipment("/operate/param/read", "post", params, 1)
					.then((res) => {
						let datas = res.data;
						datas.forEach((item) => {
							for (const key in this.moduleDetail) {
								if (item.addrId == this.currentIndex && item.id == key) {
									this.moduleDetail[key] = item.value;
								}
							}
						});
					})
					.finally(() => {
						uni.hideLoading();
					});
			},
			// 端口详情信息
			portRead(index) {
				this.$Toast.loading('加载中~');
				let params = {
					entitys: [{
							addrId: index + 1,
							id: "07010060"
						},
						{
							addrId: index + 1,
							id: "07010061"
						},
						{
							addrId: index + 1,
							id: "07010062"
						},
						{
							addrId: index + 1,
							id: "07010063"
						},
					],
					equipId: this.id,
				};
				equipment("/operate/param/read", "post", params, 1)
					.then((res) => {
						let datas = res.data;
						datas.forEach((item) => {
							for (const key in this.portDetail) {
								if (item.addrId == this.currentIndex && item.id == key) {
									this.portDetail[key] = item.value;
								}
							}
						});
					})
					.finally(() => {
						uni.hideLoading();
					});
			},

			isForbidden(type) {
				let that = this;
				let msg = type == 2 ? "解禁" : "禁用";
				uni.showModal({
					title: '提示',
					content: `确定要${msg}${that.currentIndex}号仓吗？`,
					success(res) {
						if (res.confirm) {
							that.$Toast.loading(`${msg}中~`);
							equipment(
									`/control/bin/control/${that.id}`,
									"post", {
										addrId: that.currentIndex,
										value: type,
									},
									1
								)
								.then((res) => {
									if (res.code == 200) {
										that.$Toast.none(`${that.currentIndex}号仓${msg}成功`);
										that.$refs.binpopup.close();
									}
								})
								.finally(() => (uni.hideLoading()));
						}
					}
				})
			},
			checkboxChange(e, key) {
				let value = e.detail.value;
				let check = value.length > 0 ? true : false;
				this.$set(this.checkList, key, check);
			},
			isSetting() {
				let that = this;
				let isChecked = {};
				Object.values(this.checkList).map((item, index) => {
					Object.keys(this.binDetail).filter((pp, inx) => {
						if (item && index + 17 == inx) {
							isChecked[pp] = this.binDetail[pp];
						}
					});
				});
				this.checkedParam = isChecked;
				if (Object.keys(isChecked).length == 0) {
					this.$Toast.none("请勾选需要设置的参数！");
					return;
				} else if (
					!Object.values(isChecked).every((item) => item || item == "0")
				) {
					this.$Toast.none("请设置已勾选的参数值！");
					return;
				} else {
					uni.showModal({
						title: '提示',
						content: '确认要设置仓参数吗？',
						success(res) {
							if (res.confirm) {
								that.setParams();
							}
						}
					})
				}
			},
			setParams() {
				this.$Toast.loading('设置中~');
				let paramData = [];
				for (const key in this.checkedParam) {
					paramData.push({
						id: key,
						value: this.checkedParam[key],
						addrId: this.currentIndex
					})
				}
				let params = {
					"entitys": paramData,
					"equipId": this.id
				};
				equipment("/operate/param/write", "post", params)
					.then((res) => {
						if (res.code == 200) {
							this.$Toast.none(res.message);
							for (const key in this.checkList) {
								this.$set(this.checkList, key, false)
							}
						}
					})
					.catch(err => {

					});
			},
			// 禁止弹窗滚动
			moveHandle() {
				return false
			},

			// 充电堆参数
			doRead2(inx) {
				this.$Toast.loading('加载中~');

				let params = {
					entitys: [],
					equipId: this.id,
				};

				if (inx == 1) {
					for (const key in this.cardForm2) {
						params.entitys.push({
							id: key
						});
					}
				} else if (inx == 2) {
					//读取模块下参数
					let one = {
						"07010032": undefined, //组号
					};

					this.binForm2 = {
						entitys: []
					};
					for (let i = 0; i < this.binNum; i++) {
						this.binForm2.entitys.push(one);

						params.entitys.push({
							addrId: i + 1,
							id: "07010032"
						});
					}
				}

				equipment("/operate/param/read", "post", params, 1)
					.then((res) => {
						uni.hideLoading();
						let datas = res.data;
						this.paramCode = res.code;

						datas.forEach((item) => {
							if (inx == 1) {
								for (const key in this.cardForm2) {
									if (key == item.id) {
										this.cardForm2[key] = item.value;
									}
									if (item.id == "07010031") {
										this.binNum = item.value;
									}
									if (item.id == "07010059") {
										this.binNum2 = item.value;
									}
								}
							}
						});

						if (inx == 2) {
							for (let i = 0; i < this.binForm2.entitys.length; i++) {
								for (let j = 0; j < datas.length; j++) {
									if (datas[j].id == '07010032' && datas[j].addrId == i + 1) { //模块組号
										this.binForm2.entitys[i] = {
											"07010032": datas[j].value
										};
										this.$forceUpdate();
										continue;
									}
								}
							}
						}

						if (this.binNum && inx == 1) {
							this.doRead2(2);
						}
					})
					.catch((err) => {
						this.paramCode = err.code;
					});
			},
		},
	}
</script>
<style lang="scss" scoped>
	@import "@/static/css/common.scss";

	.content {
		padding: 20rpx;
		color: #333333;
		font-size: 28rpx;

		.warn {
			margin-bottom: 20rpx;
		}

		.bin-card {
			@include flexLayout(center, flex-start);
			flex-wrap: wrap;
			color: #6A6A6A;

			.bin-one {
				width: 22.6%;
				text-align: center;

				.bin-border {
					height: 120rpx;
					line-height: 120rpx;
					border: 5rpx solid #E5E5E5;
					border-radius: 18rpx;
					margin: 20rpx 0 10rpx;
				}

				.wareHouse1 {
					border-color: #20B13B;
					color: #20B13B;
				}

				.wareHouse2 {
					border-color: #FE9201;
					color: #FE9201;
				}

				.wareHouse3 {
					border-color: #51b7b9;
					color: #51b7b9;
				}

				.wareHouse4 {
					border-color: red;
					color: red;
				}
			}

			.bin-one:not(:nth-child(4n)) {
				margin-right: 3.2%;
			}
		}

		.modules {
			::v-deep .uni-card .uni-card__content {
				padding: 0 !important;
			}

			.bin-border {
				margin: 10rpx 0 4rpx !important;
			}
		}

		.alertbox {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			background-color: white;
			border-radius: 24rpx;
			width: 640rpx;
			height: 1040rpx;
			overflow-y: auto;
			overflow-x: hidden;
			-webkit-overflow-scrolling: touch; 
			padding: 20rpx;
			color: #333333;

			.alert_title {
				text-align: center;
				margin-bottom: 20rpx;
			}

			.address {
				margin-left: 50rpx;
			}

			.alert_btn {
				line-height: 66rpx;
				position: absolute;
				bottom: 30rpx;
				left: calc(50% - 110rpx);
				background-color: #51b7b9;
				width: 220rpx;
			}

			.closeempty {
				position: absolute;
				right: 30rpx;
				top: 20rpx;
			}
		}

		/deep/ .uni-card {
			margin: 20rpx 0 !important;
		}

		.binpopbox {
			padding-top: 30rpx;

			.binparam {
				@include flexLayout(center, flex-start);

				.bin_left {
					width: 70rpx;
					height: 70rpx;
					line-height: 70rpx;
					background: #51b7b9;
					color: #ffffff;
					text-align: center;
					border-radius: 50%;
					margin: 0 20rpx;
				}

				.bin_index_left {
					width: 100%;
					z-index: 99;
					position: absolute;
					top: 35%;
					-webkit-transform: translateY(-50%);
					transform: translateY(-50%);
					font-size: 12em;
					color: rgba(0, 0, 0, .15);
					pointer-events: none;
					font-style: italic;
					text-align: center;
				}

				.binone {
					line-height: 42rpx;
					@include flexLayout(center, flex-start);

					.labels {
						display: inline-block;
						width: 260rpx;
						text-align: right;
						color: #6A6A6A;
					}
					.bin-status{
						padding: 0 10rpx;
						border-radius: 10rpx;
					}

					.group-index {
						display: inline-block;
						width: 26px;
						height: 26px;
						line-height: 26px;
						border: 2px solid #E5E5E5;
						border-radius: 50%;
						text-align: center;
						color: #333;
					}
				}
			}

			.bin_btns {
				text-align: center;
				margin-top: 30rpx;

				button {
					margin-left: 30rpx;
					background: #51b7b9;
					color: #FFFFFF;
				}
			}
		}

		.parval {
			color: #333333;
			font-size: 30rpx;
		}

		.alertbox1 {
			width: 560rpx;
			height: auto;
			padding: 60rpx 20rpx;
		}
	}

	.table {
		width: 100%;
		border-radius: 8rpx;
		display: table;
		border: 1px solid #dfdfdf;
		border-collapse: collapse;
		color: #333333;
		font-size: 28rpx;
		padding-bottom: 40rpx;
	}

	.th {
		text-align: center;
		padding: 10rpx 0;
		font-weight: bolder;
		display: table-cell;
		border-right: 1px solid #dfdfdf
	}

	.td {
		text-align: center;
		vertical-align: middle;
		background: #FFFFFF;
		padding: 10rpx 0;
		display: table-cell;
		border-right: 1px solid #dfdfdf;

		view {
			min-height: 50rpx;
		}
	}

	.tr {
		display: table-row;
		border: 1px solid #dfdfdf;
	}

	.warn-tr {
		view {
			line-height: 48rpx;
		}
	}

	.indexs {
		vertical-align: middle;
	}

	.width-text {
		width: 42%;
	}

	.time-text {
		width: 48%;
	}

	.addr-text {
		width: 10%;
	}

	.param-content {
		padding: 20rpx 20rpx 20rpx;

		.param-one {
			line-height: 92rpx;
			@include flexLayout(center, flex-start);
			border-bottom: 2rpx solid #E5E5E5;
			font-size: 28rpx;
			color: #333333;

			text {
				width: 116rpx;
				text-align: right;
				margin-right: 20rpx;
			}

			.sliders {
				width: calc(100% - 250rpx);
			}
		}

		.search_btns {
			text-align: right;
			margin: 20rpx 0;

			button {
				background-color: #51b7b9;
			}
		}
	}

	::v-deep .uni-select__selector-scroll {
		max-height: 150rpx;
	}
</style>